<template>
  <!--<vue-core-video-player :src="videopath"
                         :muted="false"
                         :autoplay="true"
                         :title="videotitle"
                         preload="auto"
                         :loop="true"></vue-core-video-player>-->

  <el-container>
    <el-container>
      <el-aside width="80%">
        <span>视频标题</span>
        <vue-core-video-player :src="videopath"
                               :muted="false"
                               :autoplay="true"
                               :title="videotitle"
                               preload="auto"
                               :loop="true"></vue-core-video-player>
      </el-aside>
      <el-main>
        <el-card class="box-card">
          <div slot="header" class="clearfix" >
            <span>视频列表</span>
          </div>
          <el-link href="javascriptevoid(0)" v-for="o in 4" :key="o"  >
            {{'第 ' + o+'集' +':视频名称    '+'   视频时长' }}</el-link>
        </el-card>
      </el-main>
    </el-container>
    <el-footer style="height: 1000px">
      <div style="height: 20%">
      <el-divider>评论发表<i class="el-icon-mobile-phone"></i></el-divider>
          <el-input
            type="textarea"
            placeholder="请输入内容"
            maxlength="200"
            show-word-limit
            v-model="textarea2">
          </el-input>
          <el-button type="primary" @click="onSubmit">发表</el-button>
      </div>
      <el-divider content-position="left">评论区域</i></el-divider>
      <div style="width: 80%;height:100px" v-for="o in 4" :key="o"  >
        <el-card class="box-card2">
          <div slot="header" class="clearfix">
            <span style="float:left;">评论人：XXXX</span>
            <span style="float:right;">评论时间：XXXX</span>
          </div>
          <span>评论内容</span>
        </el-card>
      </div>
    </el-footer>
  </el-container>
</template>

<script>

    export default {
          data(){
            return{
              //视频路径 一般是本地视频路径
             // videopath:require("../../assets/信贷资产证卷化.mp4"),
              //视频标题
              videotitle:'信贷资产证卷话',
              formInline: {
                user: '',
                region: '',
                textarea2:''
              }
            }
          },
      methods:{
        onSubmit() {
          console.log('submit!');
        }
      }
    }
</script>

<style scoped >
  .box-card {
    width: 250px;
    height:650px;
  }
</style>
